// 获取 gulp
var gulp = require("gulp");

// 获取 uglify 模块（用于压缩 JS）
var uglify = require("gulp-uglify");
var cssUglify = require("gulp-minify-css");
var autoprefix = require("gulp-autoprefixer");
var del = require("del");
var gulpif = require("gulp-if"); // 条件判断
var fileinclude = require("gulp-file-include");
var htmlmin = require("gulp-htmlmin");
var base64 = require("gulp-base64");
var imagemin = require("gulp-imagemin");
var browserSync = require("browser-sync").create(); // 用来打开一个浏览器
var cache = require("gulp-cache"); // 图片缓存（只压缩修改的图片）
var proxyMiddleware = require("http-proxy-middleware");
var ip = require("ip");

///获取本机ip地址
var ipAddr = ip.address();

// 设置环境变量
var env = process.env.NODE_ENV || "dev";

// 设置代理转发
var middleware = proxyMiddleware("/proxyOpenApi", {
  target: "http://" + ipAddr + ":8080",
  changeOrigin: true,
  pathRewrite: {
    "^/proxyOpenApi": "/htpay-merchant/open"
  },
  logLevel: "debug"
});

// 创建一个"clean"任务，作用是在编译文件之前清空dist目录下的文件
gulp.task("clean", function(cb) {
  return del(["./dist"], cb);
});

//清空缓存
gulp.task("cache.clear", function(cb) {
  cache.clearAll();
  cb();
});

//压缩  img文件
gulp.task("image", function(cb) {
  gulp
    .src("./src/assets/**/*.{png,jpg,jpeg}")
    .pipe(
      gulpif(
        env === "dev",
        cache(
          imagemin({
            optimizationLevel: 5, //类型：Number  默认：3  取值范围：0-7（优化等级）
            progressive: true, //类型：Boolean 默认：false 无损压缩jpg图片
            interlaced: true, //类型：Boolean 默认：false 隔行扫描gif进行渲染
            multipass: true //类型：Boolean 默认：false 多次优化svg直到完全优化
          })
        )
      )
    )
    .pipe(
      gulpif(
        env === "prod",
        imagemin({
          optimizationLevel: 5, //类型：Number  默认：3  取值范围：0-7（优化等级）
          progressive: true, //类型：Boolean 默认：false 无损压缩jpg图片
          interlaced: true, //类型：Boolean 默认：false 隔行扫描gif进行渲染
          multipass: true //类型：Boolean 默认：false 多次优化svg直到完全优化
        })
      )
    )
    .pipe(gulp.dest("./dist/assets"));

  cb();
});

// 压缩 js 文件
// 在命令行使用 gulp script 启动此任务
gulp.task("script", function(cb) {
  // 1. 找到文件
  gulp
    .src("./src/js/main.js")
    // 2. 压缩文件
    .pipe(uglify({ mangle: false }))
    // 3. 另存压缩后的文件
    .pipe(gulp.dest("./dist/js"));

  cb();
});

//直接拷贝
gulp.task("script-copy", function(cb) {
  gulp
    .src(["./src/js/**/*.js", "!./src/js/main.js"])
    .pipe(gulp.dest("./dist/js"));

  cb();
});

//css build
gulp.task("css", function(cb) {
  gulp
    .src(["./src/css/**/*.css", "!./src/css/**/*.min.css"])
    .pipe(base64()) //小图片base64位压缩
    .pipe(cssUglify({ keepSpecialComments: 1, processImport: false }))
    // { //通过autoprefix自动添加兼容各大浏览器的样式前缀，例如-webkit-，-o-
    //     browsers: ['last 2 versions'], //兼容最新2个版本
    //     cascade: false
    // }
    .pipe(autoprefix())
    .pipe(gulp.dest("./dist/css"));

  cb();
});

//css copy
gulp.task("css-copy", function(cb) {
  gulp.src("./src/css/**/*.min.css").pipe(gulp.dest("./dist/css"));
  cb();
});

//创建合并任务
gulp.task("html", function(cb) {
  gulp
    .src(["./src/**/*.html", "!./src/include/**/*.html"])
    // .pipe(
    //   fileinclude({
    //     prefix: "@@",
    //     basepath: "@file"
    //   })
    // )
    .pipe(
      htmlmin({
        removeComments: true, // 清除HTML注释
        collapseWhitespace: true, // 压缩空格
        collapseBooleanAttributes: true, // 省略布尔属性的值 <input checked="true"/> => <input checked>
        removeEmptyAttributes: true, // 删除所有空格作属性值 <input id=""> => <input>
        removeScriptTypeAttributes: true, // 删除<script>的type="text/javascript"
        removeStyleLinkTypeAttributes: true, // 删除<style>和<link>的type="text/css"
        minifyJS: true, // 压缩页面JS
        minifyCSS: true // 压缩页面CSS
      })
    )
    .pipe(gulp.dest("./dist"));

  cb();
});

// 启本地服务，并打开浏览器
gulp.task("browser", function(cb) {
  console.log(ipAddr);
  browserSync.init({
    host: ipAddr,
    localOnly: false,
    port: 9090,
    server: {
      baseDir: "./dist/",
      index: "aliPayment.html",
      middleware: middleware
    } // 访问目录，自动指向该目录下的 index.html 文件
  });

  cb();
});
gulp.task("browser_reload", function(cb) {
  browserSync.reload();
  cb();
});

// 监听文件变化（'add', 'change', 'unlink'）
gulp.task("watch", function() {
  gulp.watch(
    ["./src/css/**/*.css", "!./src/css/**/*.min.css"],
    gulp.series("css", "browser_reload")
  );
  gulp.watch(
    ["./src/css/**/*.min.css"],
    gulp.series("css-copy", "browser_reload")
  );
  gulp.watch(
    ["./src/js/**/*.js", "!./src/js/main.js"],
    gulp.series("script-copy", "browser_reload")
  );
  gulp.watch(["./src/js/main.js"], gulp.series("script", "browser_reload"));
  gulp.watch(
    ["./src/img/**/*.{png,jpg,gif,ico}"],
    gulp.series("image", "browser_reload")
  );
  gulp.watch(["./src/**/*.html"], gulp.series("html", "browser_reload"));
});

//构建build任务
gulp.task(
  "build",
  gulp.series(
    "clean",
    gulp.parallel(
      "script",
      "script-copy",
      "css",
      "css-copy",
      "image",
      "html",
      function(cb) {
        cb();
      }
    )
  )
);

// 开发环境
gulp.task(
  "dev",
  gulp.series(
    "clean",
    "script",
    "script-copy",
    "css",
    "css-copy",
    "image",
    "html",
    gulp.series("browser", "watch")
  )
);
